<script setup lang="ts">
const props = defineProps({
  equipmentId: {
    type: Number,
    required: true
  },
  dialog_visible: {
    type: Boolean,
    required: true
  },
  username: {
    type: String,
    required: true
  }
})

const emits = defineEmits(['update:dialog_visible'])
const dialog_visible_2 = ref(props.dialog_visible)

watch(() => props.dialog_visible, (newVal) => {
  dialog_visible_2.value = newVal
})

watch(() => dialog_visible_2.value, (newVal) => {
  emits('update:dialog_visible', newVal)
})


const borrowForm = reactive({
  borrower: '',
  equipmentId: props.equipmentId,
  reason: '',
  returnDate: ''
})

</script>

<template>
  <el-dialog v-model="dialog_visible_2" title="借用申请" :before-close="(() => { })()">
    <el-form v-model="borrowForm">
      <el-form-item label="申请人 : ">
        <el-text>{{ username }}</el-text>
      </el-form-item>
      <el-form-item label="借用资产编号 : ">
        <el-text>{{ borrowForm.equipmentId }}</el-text>
      </el-form-item>
      <el-form-item label="归还日期 : ">
        <el-date-picker v-model="borrowForm.returnDate" type="date" placeholder="年-月-日" />
      </el-form-item>
      <el-form-item label="申请理由 : ">
        <el-input type="textarea" v-model="borrowForm.reason" />
      </el-form-item>
      <el-form-item>
        <el-button text type="primary">提交</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>